<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet icon" href="./favicon.ico" />
    <!-- 引入字体图标 -->
    <link rel="stylesheet" href="./download/font_1978851_7xn1uf8t3io/iconfont.css" />
    <link rel="stylesheet" href="./css/index.css" />
  </head>
  <body>
    <!-- shortcut制作开始 -->
    <div class="shortcut">
      <div class="w">
        <div class="left fl"><span>品优购欢迎您!</span><a href="javascript:void(0)">请登录</a><a href="javascript:void(0)" class="style_red">免费注册</a></div>
        <div class="right fr">
          <ul>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li><span>丨</span></li>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li class="iconfont icondownarrow"><span>丨</span></li>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li><span>丨</span></li>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li><span>丨</span></li>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li class="iconfont icondownarrow"><span>丨</span></li>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li class="iconfont icondownarrow"><span>丨</span></li>
            <li><a href="javascript:void(0)">我的订单</a></li>
            <li class="iconfont icondownarrow"><a href="javascript:void(0)"></a></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- shortcut制作结束 -->
    <!-- 头部制作开始 -->
    <div class="header w">
      <div class="logo">
        <h1>
          <a href="javascript:void(0)" title="品优购">品优购</a>
        </h1>
      </div>
      <div class="search"><input type="text" class="text" placeholder="语言开发" /> <button>搜索</button></div>
      <div class="hotwords">
        <a href="javascript:void(0)">优惠购首发</a>
        <a href="javascript:void(0)">优惠购首发</a>
        <a href="javascript:void(0)">优惠购首发</a>
        <a href="javascript:void(0)">优惠购首发</a>
        <a href="javascript:void(0)">优惠购首发</a>
        <a href="javascript:void(0)">优惠购首发</a>
        <a href="javascript:void(0)">优惠购首发</a>
      </div>
      <div class="shopcut">
        <i class="iconfont icongouwuchekong"></i>
        我的购物车
        <i class="iconfont iconiconfontjiantou3"></i>
        <i class="gouwuche">8</i>
      </div>
    </div>
    <!-- 头部制作结束 -->
    <!-- nav制作开始 -->
    <div class="nav">
      <div class="w">
        <div class="dropdown fl">
          <div class="dt">全部商品分类</div>
          <div class="dd">
            <ul>
              <li>
                <a href="javascript:void(0)">家用电器 <span>&gt</span></a>
              </li>
              <li>
                <a href="list.html">手机、数码、通信<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">电脑、办公<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">家居、家具、家装、厨具<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">男装、女装、童装、内衣<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">个户化妆、清洁用品、宠物<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">个户化妆、清洁用品、宠物<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
              <li>
                <a href="javascript:void(0)">运动户外、钟表<span>&gt</span></a>
              </li>
            </ul>
          </div>
        </div>
        <div class="navitems fl">
          <ul>
            <li><a href="javascript:void(0)">服装城 </a></li>
            <li><a href="javascript:void(0)"> 美妆馆 </a></li>
            <li><a href="javascript:void(0)">传智超市</a></li>
            <li><a href="javascript:void(0)">传智超市</a></li>
            <li><a href="javascript:void(0)">传智超市</a></li>
            <li><a href="javascript:void(0)">传智超市</a></li>
            <li><a href="javascript:void(0)">传智超市</a></li>
            <li><a href="javascript:void(0)">有趣</a></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- nav制作结束 -->
    <!-- main部分制作开始 -->
    <div class="main w">
      <div class="main_focus">
        <ul>
          <li>
            <a href="javascript:void(0)"><img src="./upload/focus1.png" alt="" /></a>
          </li>
        </ul>
      </div>
      <div class="news">
        <div class="news_top">
          <div class="news_top_hd">
            <h2 class="fl">品优购快报</h2>
            <a href="javascript:void(0)" class="fr">更多<span class="iconfont iconiconfontjiantou3"></span></a>
          </div>
          <div class="news_top_bd">
            <ul>
              <li>
                <a href="javascript:void(0)"><strong>[特惠]</strong>全民开学季，半价购数码</a>
              </li>
              <li>
                <a href="javascript:void(0)"><strong>[特惠]</strong>全民开学季，半价购数码</a>
              </li>
              <li>
                <a href="javascript:void(0)"><strong>[特惠]</strong>全民开学季，半价购数码</a>
              </li>
              <li>
                <a href="javascript:void(0)"><strong>[特惠]</strong>全民开学季，半价购数码</a>
              </li>
              <li>
                <a href="javascript:void(0)"><strong>[特惠]</strong>全民开学季，半价购数码</a>
              </li>
            </ul>
          </div>
        </div>
        <div class="news_center">
          <ul>
            <li>
              <span>话费</span>
            </li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
            <li><span>话费</span></li>
          </ul>
        </div>
        <div class="news_bottom">
          <a href="javascript:void(0)">
            <img src="./upload/bargain.png" alt="" />
          </a>
        </div>
      </div>
    </div>
    <!-- main部分制作结束 -->
    <!-- 今日推荐制作开始 -->
    <div class="recommend w">
      <div class="recommend_left fl">
        <span class="iconfont iconclock"></span>
        <h4>今日推荐</h4>
      </div>
      <div class="recommend_right fr">
        <ul>
          <li>
            <a href="javascript:void(0)">
              <img src="./upload/today01.png" alt="" />
            </a>
          </li>
          <li>
            <a href="javascript:void(0)"> <img src="./upload/today01.png" alt="" /></a>
          </li>
          <li>
            <a href="javascript:void(0)"> <img src="./upload/today01.png" alt="" /></a>
          </li>
          <li>
            <a href="javascript:void(0)"> <img src="./upload/today01.png" alt="" /></a>
          </li>
        </ul>
      </div>
    </div>
    <!-- 今日推荐制作结束 -->
    <!-- 猜你喜欢制作开始 -->
    <div class="like w">
      <div class="like_hd">
        <h3 class="fl">猜你喜欢</h3>
        <a href="javascript:void(0)" class="fr">换一批<span class="iconfont iconshuaxinzhongjieban"></span></a>
      </div>
      <div class="like_bd">
        <ul>
          <li>
            <a href="javascript:void(0)">
              <div class="img">
                <img src="./upload/like_01.png" alt="" />
              </div>
              <div class="img_desc">
                <p>阳光美包新款单肩包女</p>
                <p>包时尚子母包四件套女</p>
                <p><i>￥</i><em>116.00</em></p>
              </div>
            </a>
          </li>
          <li>
            <a href="javascript:void(0)"
              ><div class="img">
                <img src="./upload/like_02.png" alt="" />
              </div>
              <div class="img_desc">
                <p>阳光美包新款单肩包女</p>
                <p>包时尚子母包四件套女</p>
                <p><i>￥</i><em>116.00</em></p>
              </div></a
            >
          </li>
          <li>
            <a href="javascript:void(0)"
              ><div class="img">
                <img src="./upload/like_03.png" alt="" />
              </div>
              <div class="img_desc">
                <p>阳光美包新款单肩包女</p>
                <p>包时尚子母包四件套女</p>
                <p><i>￥</i><em>116.00</em></p>
              </div></a
            >
          </li>
          <li>
            <a href="javascript:void(0)"
              ><div class="img">
                <img src="./upload/like_04.png" alt="" />
              </div>
              <div class="img_desc">
                <p>阳光美包新款单肩包女</p>
                <p>包时尚子母包四件套女</p>
                <p><i>￥</i><em>116.00</em></p>
              </div></a
            >
          </li>
          <li>
            <a href="javascript:void(0)"
              ><div class="img">
                <img src="./upload/like_05.png" alt="" />
              </div>
              <div class="img_desc">
                <p>阳光美包新款单肩包女</p>
                <p>包时尚子母包四件套女</p>
                <p><i>￥</i><em>116.00</em></p>
              </div></a
            >
          </li>
          <li>
            <a href="javascript:void(0)"
              ><div class="img">
                <img src="./upload/like_06.png" alt="" />
              </div>
              <div class="img_desc">
                <p>阳光美包新款单肩包女</p>
                <p>包时尚子母包四件套女</p>
                <p><i>￥</i><em>116.00</em></p>
              </div></a
            >
          </li>
        </ul>
      </div>
    </div>
    <!-- 猜你喜欢制作结束 -->
    <!-- 传智播客有趣区开始 -->
    <div class="youqu w">
      <div class="youqu_hd">
        <h3 class="fl">传智播客·有趣区</h3>
      </div>
      <div class="youqu_bd">
        <div class="w404 fl">
          <a href="javascript:void(0)">
            <img src="./upload/interest01.png" alt="">
          </a>
        </div>
        <div class="w225 fl">
          <h4>好东西</h4>
          <a href="javascript:void(0)"><img src="./upload/interest02.png" alt=""></a>
          <a href="javascript:void(0)"><img src="./upload/interest03.png" alt=""></a>
        </div>
        <div class="w405 fl">
          <h4>品牌街</h4>
          <a href="javascript:void(0)"><img src="./upload/interest04.png" alt=""></a>
          <a href="javascript:void(0)"><img src="./upload/interest05.png" alt=""></a>
          <a href="javascript:void(0)"><img src="./upload/interest06.png" alt=""></a>
        </div>
        <div class="w159 fl">
          <ul>
            <li><a href="javascript:void(0)">
              <img src="./upload/brand01.png" alt="">
            </a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand01.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand02.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand03.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand04.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand05.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand06.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand07.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand08.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand09.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand10.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand11.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand12.png" alt=""></a></li>
            <li><a href="javascript:void(0)"><img src="./upload/brand13.png" alt=""></a></li>
          </ul>
        </div>
      </div>
    </div>
      <!-- 传智播客有趣区结束 -->
      <!-- floor楼层去制作开始 -->
     <div class="floor">
      <!-- 家用电器制作开始 -->
      <div class="jiadian w">
        <div class="jiadian_hd">
          <h4 class="fl">家用电器</h4>
         <div class="jiadian_hd_right fr">
          <ul>
            <li><a href="#" class="style_red">热门</a|</li>
            <li><a href="#">大家电</a>|</li>
            <li><a href="#">生活电器</a>|</li>
            <li><a href="#">生活电器</a>|</li>
            <li><a href="#">生活电器</a>|</li>
            <li><a href="#">生活电器</a>|</li>
            <li><a href="#">生活电器</a>|</li>
            <li><a href="#">生活电器</a>|</li>
            <li><a href="#">生活电器</a></li>
          </ul>
         </div>
        </div>
        <div class="jiadian_bd">
          <div class="w209">
            <ul>
              <li><a href="#">节能补贴</a></li>
              <li><a href="#">节能补贴</a></li>
              <li><a href="#">节能补贴</a></li>
              <li><a href="#">节能补贴</a></li>
              <li><a href="#">节能补贴</a></li>
              <li><a href="#">节能补贴</a></li>
            </ul>
            <a href="#">
              <img src="./upload/floor-1-1.png" alt="">
            </a> 
          </div>
          <div class="w329">
            <a href="#">
              <img src="./upload/floor-1-b01.png" alt="">
            </a>
          </div>
            <div class="w217">
              <a href="#">
                <img src="./upload/floor-1-2.png" alt="">
              </a>
              <a href="#">
                <img src="./upload/floor-1-3.png" alt="">
              </a>
            </div>
            <div class="w218">
              <a href="#">
                <img src="./upload/floor-1-4.png" alt="">
              </a>
            </div>
            <div class="w2188">
              <a href="#">
                <img src="./upload/floor-1-5.png" alt="">
              </a>
              <a href="#">
                <img src="./upload/floor-1-6.png" alt="">
              </a>
            </div>
        </div>
      </div>
      <!-- 家用电器制作结束 -->
    </div>
 <!-- floor楼层去制作结束 -->
    <!-- footer制作开始 -->
    <div class="footer">
      <div class="w">
        <div class="service">
          <ul>
            <li>
            <div>
              <i class="mod_service mod_service_zheng"></i>
              <div class="zhengpin">
                <h5>正品保障</h5>
                <p>正品保障，提供发票</p>
              </div>
            </li>
            <li>
              <i class="mod_service mod_service_jisu"></i>
              <div class="wuliu">
                <h5>极速物流</h5>
                <p>急速物流，急速送达</p>
              </div>
            </li>
            <li>
              <i class="mod_service mod_service_jisu"></i>
              <div class="wuliu">
                <h5>极速物流</h5>
                <p>急速物流，急速送达</p>
              </div>
            </li>
            <li>
              <i class="mod_service mod_service_jisu"></i>
              <div class="wuliu">
                <h5>极速物流</h5>
                <p>急速物流，急速送达</p>
              </div>
            </li>
            <li>
              <i class="mod_service mod_service_jisu"></i>
              <div class="wuliu">
                <h5>极速物流</h5>
                <p>急速物流，急速送达</p>
              </div>
            </li>
          </ul>
        </div>
        <div class="help">
          <dl>
            <dt>购物指南</dt>
            <dd>购物流程</dd>
            <dd>会员介绍</dd>
            <dd>生活旅行/团购</dd>
            <dd>常见问题</dd>
            <dd>大家电</dd>
            <dd>联系客服</dd>
          </dl>
          <dl>
            <dt>购物指南</dt>
            <dd>购物流程</dd>
            <dd>会员介绍</dd>
            <dd>生活旅行/团购</dd>
            <dd>常见问题</dd>
            <dd>大家电</dd>
            <dd>联系客服</dd>
          </dl>
          <dl>
            <dt>购物指南</dt>
            <dd>购物流程</dd>
            <dd>会员介绍</dd>
            <dd>生活旅行/团购</dd>
            <dd>常见问题</dd>
            <dd>大家电</dd>
            <dd>联系客服</dd>
          </dl>
          <dl>
            <dt>购物指南</dt>
            <dd>购物流程</dd>
            <dd>会员介绍</dd>
            <dd>生活旅行/团购</dd>
            <dd>常见问题</dd>
            <dd>大家电</dd>
            <dd>联系客服</dd>
          </dl>
          <dl>
            <dt>购物指南</dt>
            <dd>购物流程</dd>
            <dd>会员介绍</dd>
            <dd>生活旅行/团购</dd>
            <dd>常见问题</dd>
            <dd>大家电</dd>
            <dd>联系客服</dd>
          </dl>
          <dl>
            <dt class="help_center">帮助中心</dt>
            <dd>
              <img src="./img/images/wx_cz.jpg" alt="" />
            </dd>
            <p>品优购客户端</p>
          </dl>
        </div>
        <div class="copyright">
          <div class="link">联系我们 | 联系客服 | 商家入驻 | 营销中心 | 手机品优购 | 友情链接 | 销售联盟 | 品优购社区 | 品优购公益 | English Site | Contact U</div>
          <div class="mod_copright">
            地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn <br />
            京ICP备08001421号京公网安备110108007702
          </div>
        </div>
      </div>
    </div>
    <!-- footer制作结束 -->
  </body>
</html>
